import { WEBSOCKET_URL } from '@/config/UrlConfig'
import { ref } from 'vue'
import { useChatMessageStore } from '@/stores'
import type { ChatMessage } from '@/types/chatmessage'
import { useChatListStore } from '@/stores/modules/chatList'

export function useWebSocket() {
  // 存储 WebSocket 实例
  const socket = ref<WebSocket | null>(null)
  // 标记 WebSocket 是否已连接
  const isConnected = ref(false)

  // 播放提示音
  const audio = new Audio('/audio/iphone4短信--三全音.mp3')
  // 控制是否允许重新连接
  const shouldReconnect = ref(true)

  // 连接到 WebSocket 服务器
  const connect = (userId: string) => {
    // 动态生成 WebSocket URL
    const websocketUrl = `${WEBSOCKET_URL}/${userId}`
    init(websocketUrl)
  }

  // 连接到 WebSocket 服务器
  const init = (url: string) => {
    socket.value = new WebSocket(url)

    // 监听连接打开
    socket.value.onopen = () => {
      isConnected.value = true
      console.log('WebSocket 连接已打开')
    }

    // 监听服务端发来的消息
    socket.value.onmessage = event => {
      const res = JSON.parse(event.data)
      // 获取聊天列表
      useChatListStore()
        .getChatLists()
        .then(() => {
          console.log('前端收到来自服务端的消息:', res)
          // 如果聊天窗口未打开或者打开的不是当前消息的聊天列表，就弹窗提示新消息
          if (useChatMessageStore().isChatMessageOpened !== res.chatListId) {
            // 弹窗提示新消息
            ElNotification({
              title: res.fromUserNick,
              message: res.content,
              type: 'success',
            })
          }
          // 播放提示音
          audio.play()

          // TODO 当来的消息是当前列表时，要push到messages中,否则不push
          if (useChatMessageStore().isChatMessageOpened === res.chatListId) {
            useChatMessageStore().messages.push(res)
          }
          // 将新消息移动到聊天列表的第一位
          const chatListStore = useChatListStore()
          const chatIndex = chatListStore.chatList.findIndex(item => item.id === res.chatListId)
          if (chatIndex !== -1) {
            const [chatItem] = chatListStore.chatList.splice(chatIndex, 1)
            chatItem.chatMessage = res
            chatListStore.chatList.unshift(chatItem)
          }
        })
    }

    // 监听连接关闭
    socket.value.onclose = () => {
      isConnected.value = false
      // 尝试重新连接
      if (shouldReconnect.value) {
        // 如果允许重新连接，延迟尝试重新连接
        setTimeout(connect, 1000)
        console.log('WebSocket 连接已关闭,正在尝试重新连接')
      }
    }

    socket.value.onerror = error => {
      console.error('WebSocket 错误:', error)
    }
  }

  // 发送消息
  const send = (message: ChatMessage) => {
    if (socket.value && socket.value.readyState === WebSocket.OPEN) {
      socket.value.send(JSON.stringify(message))
    } else {
      console.error('WebSocket 未打开。当前状态:', socket.value?.readyState)
    }
  }

  // 手动关闭 WebSocket 连接
  const disconnect = () => {
    shouldReconnect.value = false // 主动关闭时不允许重新连接
    // 只有当 WebSocket 实例存在时才执行关闭操作
    if (socket.value) {
      socket.value.close()
      socket.value = null
      console.log('已经主动断开连接')
    }
  }

  return {
    socket,
    isConnected,
    send,
    disconnect,
    connect,
  }
}
